// place your custom styles here
// * {
//   font-family: Georgia Pro,
//   Crimson,
//   Georgia,
//   -apple-system,
//   BlinkMacSystemFont,
//   "Segoe UI",
//   Roboto,
//   Oxygen,
//   Ubuntu,
//   Cantarell,
//   "Fira Sans",
//   "Droid Sans",
//   "Helvetica Neue",
//   STHeiti,
//   "Microsoft YaHei",
//   SimSun,
//   sans-serif
// }

// .vp-blog-mask {
//   background-size: 100% 100% !important;
// }

@media (min-width: 1440px) {
  .vp-feature-item {
    flex-basis: calc(33% - 3rem);
  }
}

.vp-hero-info-wrapper {
  min-height: 500px;
}

.vp-site-name {
  display: none;
}

.vp-badge {
  min-height: 18px;
  height: auto;
  padding: 5px;
}

.my-catalog-page .theme-hope-content {
  a {
    cursor: pointer;
    display: inline-block;
    margin: 4px 8px;
    padding: 4px 8px;
    border-radius: 6px;
    background-color: var(--catalog-bg-secondary-color);
    line-height: 1.5;
    overflow-wrap: break-word;
    transition: background-color 0.3s, color 0.3s;

    &:hover {
      background-color: var(--theme-color);
      color: var(--bg-color);
      text-decoration: none !important;
    }
  }
}

// 幻灯片 vue 演示代码专用
.ppt-vue-code {

  .vp-breadcrumb,
  .vp-page-meta,
  .vp-page-title {
    display: none;
  }

  .theme-hope-content {
    padding: 0 !important;
  }
}

// 幻灯片
.vp-reveal {
  code {
    font-size: 0.8em;
  }

  pre {
    line-height: 1em;
  }

  .reveal .hljs.has-highlights tr:not(.highlight-line) {
    opacity: 0.1;
  }

  .ppt-text {
    font-size: 20px;
  }

  // 设置PPT字体大小
  $pptText: 14,
  16,
  18,
  20,
  22,
  26,
  28,
  30;

  @for $fi from 1 through length($pptText) {
    .ppt-text-#{nth($pptText, $fi)} {
      font-size: #{nth($pptText, $fi)}px;
    }
  }
}

// vue/repl 默认高度配置
.vue-playground-wrapper .repl-container .vue-repl {
  height: 400px;
}

// 设置高度变量列表
$replHeights: 500,
600,
700,
800,
900,
1000,
1200,
1500;

@for $hi from 1 through length($replHeights) {
  .repl-height-#{nth($replHeights, $hi)} {
    .vue-playground-wrapper .repl-container .vue-repl {
      height: #{nth($replHeights, $hi)}px;
    }
  }
}